<meta charset="utf-8">
<link rel="stylesheet" href="../src/css/pages/customAudience.css">
<!--右侧区域：开始-->
<!--需要修改的区域 ：开始-->
<div class="fmp-container">
    <div class="audience-c">

        <div class="ndp-tab-wrapper" name="plain-tab" style="margin:5px 0 10px 0;"></div>
        <div class="">
            <button id="au-create-btn" class="btn btn btn-primary">{{i18n-createCustomAudience}}</button>
            <div class="highlight">
                <!--<label>{{i18n-filter}}</label>-->
                <div class="select-c">
                    <select class="custom-list-array"></select>
                </div>
                <div class="select-c">
                    <select class="app-list-array"></select>
                </div>
                <button id="au-search-btn" class="btn btn-primary btn-sm">{{i18n-query}}</button>
            </div>
            <!--列表：开始-->
            <table list-manager="listAdwordsByTags">
                <thead>
                    <tr>
                        <th th-name="t-name">{{i18n-audienceName}}</th>
                        <th th-name="t-source">{{i18n-source}}</th>
                        <th th-name="t-person">{{i18n-createUser}}</th>
                        <th th-name="t-scale">{{i18n-scale}}</th>
                        <th th-name="t-time">{{i18n-updateTime}}</th>
                        <th th-name="t-status">{{i18n-status}}</th>
                        <th th-name="t-options">{{i18n-opt}}</th>
                    </tr>
                </thead>
                <tbody id="au-grid">
                </tbody>
            </table>
            <!--列表：结束-->
        </div>
    </div>
</div>
<!--需要修改的区域 ：结束-->
<!--右侧区域：结束-->
<!--注销提示：开始-->
<div id="MsgBoxBack" class="divMessageBox">
    <div class="MessageBoxContainer">
        <div class="MessageBoxMiddle">
            <span class="MsgTitle">
                        <i class="fa fa-sign-out txt-color-orangeDark"></i> {{i18n-exit}}
                        <span class="txt-color-orangeDark">
                            <strong></strong>
                        </span> ?
            </span>
            <p class="pText">{{i18n-exitConfirm}}</p>
            <div class="MessageBoxButtonSection">
                <button class="btn btn-default btn-sm" cancel-action> No</button>
                <button class="btn btn-default btn-sm" logout-action> Yes</button>
            </div>
        </div>
    </div>
</div>
<!--注销提示：结束-->
<!-- 创建受众 begin -->
<div id="create-au-dialog" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">{{i18n-createCustomAudience}}</h4>
            </div>
            <div class="modal-body" name="step1">
                <div name="manual-btn" class="au-panel au-panel-on">
                    <img src="imgs/manually-create_icon.svg">
                    <span>{{i18n-manualCreateCustomAudience}}</span>
                </div>
                <div class="au-panel closed">
                    <img src="imgs/automatically-create_icon.svg">
                    <div>{{i18n-manualCreateCustomAudienceNoAuth1}}
                        <h6>{{i18n-manualCreateCustomAudienceNoAuth2}}</h6></div>
                </div>
            </div>
            <div class="modal-body " name="step2" style="display: none;">
                <div name="user-list-btn" class="au-panel-2 au-panel-on">
                    <img src="imgs/client-list_icon.svg">
                    <div>
                        <p>{{i18n-customerList}}</p>
                        <p>
                            <small>{{i18n-emailList}}</small>
                        </p>
                    </div>
                </div>
                <div class="au-panel-2">
                    <img src="imgs/application-activity_icon.svg">
                    <div>
                        <p>{{i18n-appAction}}</p>
                        <p>
                            <small>{{i18n-notSupport}}</small>
                        </p>
                    </div>
                </div>
                <div class="au-panel-2">
                    <img src="imgs/site-traffic_icon.svg">
                    <div>
                        <p>{{i18n-webSite}}</p>
                        <p>
                            <small>{{i18n-notSupport}}</small>
                        </p>
                    </div>
                </div>
            </div>
            <div class="modal-body" name="step3" style="display: none;">
                <form id="addFileForm" class="form-horizontal" role="form">
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><strong>{{i18n-dataType}}</strong></label>
                        <select name="importedType" class="data-type"></select>
                        <input name="audienceType" value="CUSTOMER_ROSTER" type="hidden" />
                        <input name="deliverType" value="UPLOAD_TEXT_FILE" type="hidden" />
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><strong>{{i18n-appId}}</strong></label>
                        <select name="appIds" class="app-no"></select>
                        <footer name="info">{{i18n-datasourceAppId}}</footer>
                    </div>
                    <div class="form-group uploadType">
                        <label class="col-sm-2 control-label"><strong>{{i18n-uploadType}}</strong></label>
                        <label class="radio-inline">
                            <input type="radio" checked="checked" name="add-style-redio" value="0">{{i18n-addFile}}
                        </label>
                        <label class="radio-inline">
                            <input type="radio" name="add-style-redio" value="1"> {{i18n-pastedata}}
                        </label>
                        <div name="addPanel" class="panel panel-default">
                            <!-- 文件拖拽 -->
                            <div name="fine-uploader-manual-trigger"></div>
                            <footer name="warn"></footer>
                        </div>
                        <!-- 数据粘贴-->
                        <div name="pastePanel" class="panel panel-default" style="display: none;">
                            <textarea name="addContent" class="form-control" placeholder="{{i18n-pastedataMsg}}"></textarea>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-body" name="step4" style="display: none;">
                <p>{{i18n-customerListSucceedPre}}&nbsp;
                    <span class="audience-update-users"></span>
                    {{i18n-customerListSucceedPost}}</p>
                <label>{{i18n-audienceName}}</label>
                <input type="text" value="" placeholder="{{i18n-audienceNameMsg}}" maxlength="100" />
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary step3-btn" style="display: none;">{{i18n-upload}}</button>
                <button type="button" class="btn btn-primary step4-btn" style="display: none;">{{i18n-complete}}</button>
                <button type="button" class="btn btn-default cancel-btn" data-dismiss="modal">{{i18n-cancel}}</button>
                <button type="button" class="btn btn-default step3-back-btn" style="display: none;">{{i18n-return}}</button>
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>
<div id="update-au-dialog" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">{{i18n-updateTitle}}</h4>
            </div>
            <div class="modal-body" name="step3">
                <form id="updateForm" class="form-horizontal" role="form">
                    <div class="form-group">
                        <label class="col-sm-2 control-label"><strong>{{i18n-dataType}}</strong></label>
                        <label class="radio-inline">
                            <input type="radio" checked="checked" name="editType" value="add">{{i18n-addCustomer}}
                        </label>
                        <label class="radio-inline">
                            <input type="radio" name="editType" value="remove"> {{i18n-removeCustomer}}
                        </label>
                        <label class="radio-inline">
                            <input type="radio" name="editType" value="replace"> {{i18n-replaeCustomer}}
                        </label>
                        <input type="hidden" id="templateId" name="templateId" value="" />
                        <input name="audienceType" value="CUSTOMER_ROSTER" type="hidden" />
                        <input name="deliverType" value="UPLOAD_TEXT_FILE" type="hidden" />
                    </div>
                    <div class="form-group uploadType">
                        <label class="col-sm-2 control-label"><strong>{{i18n-uploadType}}</strong></label>
                        <label class="radio-inline">
                            <input type="radio" checked="checked" name="update-style-redio" value="0">{{i18n-addFile}}
                        </label>
                        <label class="radio-inline">
                            <input type="radio" name="update-style-redio" value="1"> {{i18n-pastedata}}
                        </label>
                        <div name="addPanel" class="panel panel-default">
                            <!-- 文件拖拽 -->
                            <div name="update-fileupload-trigger"></div>
                            <footer name="warn"></footer>
                        </div>
                        <!-- 数据粘贴-->
                        <div name="pastePanel" class="panel panel-default" style="display: none;">
                            <textarea name="updateContent" class="form-control" placeholder="{{i18n-pastedataMsg}}"></textarea>
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary update-btn">{{i18n-update}}</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">{{i18n-cancel}}</button>
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>
<div id="delete-au-dialog" class="modal fade">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title">{{i18n-deleteTitle}}</h4>
            </div>
            <div class="modal-body">
                <p>{{i18n-delConfirmPre}}“&nbsp;<span name="del-name"></span>&nbsp;”{{i18n-delConfirmPost}}</p>
                <div class="radio">
                    <label>
                        <input type="radio" name="delete-radio" value="1" checked> {{i18n-delConfirmYes}}
                    </label>
                </div>
                <div class="radio">
                    <label>
                        <input type="radio" name="delete-radio" value="2"> {{i18n-delConfirmNo}}
                    </label>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-primary delete-btn"> {{i18n-ok}}</button>
                <button type="button" class="btn btn-default" data-dismiss="modal"> {{i18n-cancel}}</button>
            </div>
        </div>
        <!-- /.modal-content -->
    </div>
    <!-- /.modal-dialog -->
</div>
<!-- 创建受众 end -->
<!-- 上传插件模板 -->
<script type="text/template" id="qq-template-manual-trigger">
    <div class="qq-uploader-selector qq-uploader" qq-drop-area-text="Drop files here">
        <div class="qq-total-progress-bar-container-selector qq-total-progress-bar-container" style="display: none;">
            <div role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" class="qq-total-progress-bar-selector qq-progress-bar qq-total-progress-bar"></div>
        </div>
        <div class="qq-upload-drop-area-selector qq-upload-drop-area" qq-hide-dropzone>
            <span class="qq-upload-drop-area-text-selector"></span>
        </div>
        <div class="buttons">
            <div class="qq-upload-button-selector qq-upload-button">
                <div>{{i18n-uploadMsg}}</div>
            </div>
        </div>
        <span class="qq-drop-processing-selector qq-drop-processing">
            <span>Processing dropped files...</span>
        <span class="qq-drop-processing-spinner-selector qq-drop-processing-spinner"></span>
        </span>
        <ul class="qq-upload-list-selector qq-upload-list" aria-live="polite" aria-relevant="additions removals">
            <li>
                <div class="qq-progress-bar-container-selector">
                    <div role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" class="qq-progress-bar-selector qq-progress-bar"></div>
                </div>
                <span class="qq-upload-spinner-selector qq-upload-spinner"></span>
                <img class="qq-thumbnail-selector" qq-max-size="100" qq-server-scale>
                <span class="qq-upload-file-selector qq-upload-file"></span>
                <!--<span class="qq-edit-filename-icon-selector qq-edit-filename-icon"-->
                <!--aria-label="Edit filename"></span>-->
                <!--<input class="qq-edit-filename-selector qq-edit-filename" tabindex="0"-->
                <!--type="text">-->
                <span class="qq-upload-size-selector qq-upload-size"></span>
                <button type="button" onclick="javascript:$('footer[name=warn]').html('');$('.step3-btn').removeAttr('disabled');$('.update-btn').removeAttr('disabled');" class="close qq-btn qq-upload-cancel-selector qq-upload-cancel">
                    <span aria-hidden="true">&times;</span>
                    <span class="sr-only">Close</span>
                </button>
                <!--<button type="button"-->
                <!--class="qq-btn qq-upload-retry-selector qq-upload-retry">Retry-->
                <!--</button>-->
                <button type="button" class="qq-btn qq-upload-delete-selector qq-upload-delete">Delete
                </button>
                <span role="status" class="qq-upload-status-text-selector qq-upload-status-text"></span>
            </li>
        </ul>
        <dialog class="qq-alert-dialog-selector">
            <div class="qq-dialog-message-selector"></div>
            <div class="qq-dialog-buttons">
                <button type="button" class="qq-cancel-button-selector">Close</button>
            </div>
        </dialog>
        <dialog class="qq-confirm-dialog-selector">
            <div class="qq-dialog-message-selector"></div>
            <div class="qq-dialog-buttons">
                <button type="button" class="qq-cancel-button-selector">No</button>
                <button type="button" class="qq-ok-button-selector">Yes</button>
            </div>
        </dialog>
        <dialog class="qq-prompt-dialog-selector">
            <div class="qq-dialog-message-selector"></div>
            <input type="text">
            <div class="qq-dialog-buttons">
                <button type="button" class="qq-cancel-button-selector">Cancel</button>
                <button type="button" class="qq-ok-button-selector">Ok</button>
            </div>
        </dialog>
    </div>
</script>
<!-- end -->
